<template>
<div>
  <v-form
      ref="form"
      :lazy-validation="false"
    >
    <v-row>
      <v-col cols="10">
        <v-card flat>
          <v-card-text>
            <v-expansion-panels
              v-model="panel"
              multiple
              tile
            >
              <v-expansion-panel readonly>
                <v-expansion-panel-header hide-actions>
                  <div class="d-flex align-center justify-space-between">
                    <span>导游信息</span>
                    <div>
                      <v-btn color="warning" class="mr-8" rounded small>{{ $t('actions.delete') }}</v-btn>
                      <v-btn color="primary" rounded small>{{ $t('actions.add') }}</v-btn>
                    </div>
                  </div>
                </v-expansion-panel-header>
                <v-divider />
                <v-container class="py-0">
                  <v-row>
                    <v-col cols="6" class="py-0 form-item-border">
                      <v-row align="center" style="height: 100%;">
                        <label class="text-right flex-shrink-0" style="width: 140px;">导游姓名：</label>
                        <div class="pr-4 flex-grow-1">
                          <v-text-field></v-text-field>
                        </div>
                      </v-row>
                    </v-col>
                    <v-col cols="6" class="py-0 form-item-border">
                      <v-row align="center" style="height: 100%;">
                        <label class="text-right flex-shrink-0" style="width: 140px;">导游英文名：</label>
                        <div class="pr-4 flex-grow-1">
                          <v-text-field></v-text-field>
                        </div>
                      </v-row>
                    </v-col>
                  </v-row>
                  <v-row>
                    <v-col cols="6" class="py-0 form-item-border">
                      <v-row align="center" style="height: 100%;">
                        <label class="text-right flex-shrink-0" style="width: 140px;">联系电话：</label>
                        <div class="pr-4 flex-grow-1">
                          <v-text-field></v-text-field>
                        </div>
                      </v-row>
                    </v-col>
                    <v-col cols="6" class="py-0 form-item-border">
                      <v-row align="center" style="height: 100%;">
                        <label class="text-right flex-shrink-0" style="width: 140px;">导游评分：</label>
                        <div class="pr-4 flex-grow-1">
                          <v-rating
                            color="yellow darken-3"
                            background-color="grey darken-1"
                            empty-icon="$ratingFull"
                            half-increments
                          ></v-rating>
                        </div>
                      </v-row>
                    </v-col>
                  </v-row>
                  <v-row>
                    <v-col cols="6" class="py-0 form-item-border">
                      <v-row align="center" style="height: 100%;">
                        <label class="text-right flex-shrink-0" style="width: 140px;">安排状态：</label>
                        <div class="pr-4 flex-grow-1">
                          <v-select
                            :items="['预订带团', '确认带团']"
                            >
                          </v-select>
                        </div>
                      </v-row>
                    </v-col>
                    <v-col cols="6" class="py-0 form-item-border">
                      <v-row align="center" style="height: 100%;">
                        <label class="text-right flex-shrink-0" style="width: 140px;">备注：</label>
                        <div class="pr-4 flex-grow-1">
                          <v-text-field></v-text-field>
                        </div>
                      </v-row>
                    </v-col>
                  </v-row>
                </v-container>
              </v-expansion-panel>

              <v-expansion-panel readonly>
                <v-expansion-panel-header hide-actions>
                  <div class="d-flex align-center justify-space-between">
                    <span>购物佣金</span>
                    <span>计算人数：11</span>
                  </div>
                </v-expansion-panel-header>
                <v-divider />
                <v-container class="pa-0">
                  <el-table
                    :data="tableData"
                    border
                    @selection-change="handleSelectionChange">
                    <el-table-column
                      type="selection"
                      width="55">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="进店日期"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="购物店名称"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="项目"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="币种"
                      width="100">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="汇率"
                      width="100">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="总购物"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="数量"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="导游预计佣金"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="领队预计佣金"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="司机预计佣金"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="二次返佣"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="备注"
                      width="140">
                    </el-table-column>
                  </el-table>
                </v-container>
              </v-expansion-panel>

              <v-expansion-panel readonly>
                <v-expansion-panel-header hide-actions>
                  <div class="d-flex align-center justify-space-between">
                    <span>自费佣金</span>
                  </div>
                </v-expansion-panel-header>
                <v-divider />
                <v-container class="pa-0">
                  <el-table
                    :data="tableData"
                    border
                    @selection-change="handleSelectionChange">
                    <el-table-column
                      type="selection"
                      width="55">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="日期"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="自费点"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="自费项目"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="币种"
                      width="100">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="汇率"
                      width="100">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="自费总额"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="自费人数"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="导游预计佣金"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="领队预计佣金"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="司机预计佣金"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="二次返佣"
                      width="140">
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="备注"
                      width="140">
                    </el-table-column>
                  </el-table>
                </v-container>
              </v-expansion-panel>

              <v-expansion-panel readonly>
                <v-expansion-panel-header hide-actions>
                  <div class="d-flex align-center justify-space-between">
                    <span>公司收导游</span>
                    <v-btn color="primary" rounded small>{{ $t('actions.add') }}</v-btn>
                  </div>
                </v-expansion-panel-header>
                <v-divider />
                <v-container class="pa-0">
                  <el-table
                    :data="tableData"
                    border>
                    <el-table-column
                      prop="date"
                      label="费用项目"
                      width="200">
                      <template slot="header">
                        <span class="mr-1">费用项目</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="单价"
                      width="140">
                      <template slot="header">
                        <span class="mr-1">单价</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="数量"
                      width="100">
                      <template slot="header">
                        <span class="mr-1">数量</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="额外费用"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="额外费用说明"
                      width="180">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="收款总额"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="备注"
                      min-width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      fixed="right"
                      prop="date"
                      label="审核"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-switch class="mt-0" dense hide-details :input-value="row.status == 1" :label="row.status == 1 ? '已审核' : '未审核'" @change="setStatus(row)"></v-switch>
                      </template>
                    </el-table-column>
                    <el-table-column
                        fixed="right"
                        :label="$t('other.action')"
                        width="80">
                        <template slot-scope="{ $index }">
                          <v-btn small color="warning" outlined @click="handleRmoveTourfee($index)">{{ $t('actions.delete') }}</v-btn>
                        </template>
                      </el-table-column>
                  </el-table>
                </v-container>
              </v-expansion-panel>

              <v-expansion-panel readonly>
                <v-expansion-panel-header hide-actions>
                  <div class="d-flex align-center justify-space-between">
                    <span>导游代收</span>
                    <v-btn color="primary" rounded small>{{ $t('actions.add') }}</v-btn>
                  </div>
                </v-expansion-panel-header>
                <v-divider />
                <v-container class="pa-0">
                  <el-table
                    :data="tableData"
                    border>
                    <el-table-column
                      prop="date"
                      label="费用类型"
                      width="140">
                      <template slot="header">
                        <span class="mr-1">费用类型</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="费用项目"
                      width="180">
                      <template slot="header">
                        <span class="mr-1">费用项目</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="单价"
                      width="140">
                      <template slot="header">
                        <span class="mr-1">单价</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="数量"
                      width="100">
                      <template slot="header">
                        <span class="mr-1">数量</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="额外费用"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="额外费用说明"
                      width="180">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="收款总额"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="备注"
                      min-width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      fixed="right"
                      prop="date"
                      label="审核"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-switch class="mt-0" dense hide-details :input-value="row.status == 1" :label="row.status == 1 ? '已审核' : '未审核'" @change="setStatus(row)"></v-switch>
                      </template>
                    </el-table-column>
                    <el-table-column
                        fixed="right"
                        :label="$t('other.action')"
                        width="80">
                        <template slot-scope="{ $index }">
                          <v-btn small color="warning" outlined @click="handleRmoveTourfee($index)">{{ $t('actions.delete') }}</v-btn>
                        </template>
                      </el-table-column>
                  </el-table>
                </v-container>
              </v-expansion-panel>

              <v-expansion-panel readonly>
                <v-expansion-panel-header hide-actions>
                  <div class="d-flex align-center justify-space-between">
                    <span>公司付导游</span>
                    <v-btn color="primary" rounded small>{{ $t('actions.add') }}</v-btn>
                  </div>
                </v-expansion-panel-header>
                <v-divider />
                <v-container class="pa-0">
                  <el-table
                    :data="tableData"
                    border>
                    <el-table-column
                      prop="date"
                      label="费用项目"
                      width="200">
                      <template slot="header">
                        <span class="mr-1">费用项目</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="单价"
                      width="140">
                      <template slot="header">
                        <span class="mr-1">单价</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="数量"
                      width="100">
                      <template slot="header">
                        <span class="mr-1">数量</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="额外费用"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="额外费用说明"
                      width="180">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="付款总额"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="备注"
                      min-width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      fixed="right"
                      prop="date"
                      label="审核"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-switch class="mt-0" dense hide-details :input-value="row.status == 1" :label="row.status == 1 ? '已审核' : '未审核'" @change="setStatus(row)"></v-switch>
                      </template>
                    </el-table-column>
                    <el-table-column
                        fixed="right"
                        :label="$t('other.action')"
                        width="80">
                        <template slot-scope="{ $index }">
                          <v-btn small color="warning" outlined @click="handleRmoveTourfee($index)">{{ $t('actions.delete') }}</v-btn>
                        </template>
                      </el-table-column>
                  </el-table>
                </v-container>
              </v-expansion-panel>

              <v-expansion-panel readonly>
                <v-expansion-panel-header hide-actions>
                  <div class="d-flex align-center justify-space-between">
                    <span>导游代付</span>
                    <v-btn color="primary" rounded small>{{ $t('actions.add') }}</v-btn>
                  </div>
                </v-expansion-panel-header>
                <v-divider />
                <v-container class="pa-0">
                  <el-table
                    :data="tableData"
                    border>
                    <el-table-column
                      label="日期"
                      width="180">
                      <date-picker type="date" small></date-picker>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="费用类型"
                      width="140">
                      <template slot="header">
                        <span class="mr-1">费用类型</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="费用项目"
                      width="180">
                      <template slot="header">
                        <span class="mr-1">费用项目</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="单价"
                      width="140">
                      <template slot="header">
                        <span class="mr-1">单价</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="数量"
                      width="100">
                      <template slot="header">
                        <span class="mr-1">数量</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="额外费用"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="额外费用说明"
                      width="180">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="金额合计"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="备注"
                      min-width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      fixed="right"
                      prop="date"
                      label="审核"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-switch class="mt-0" dense hide-details :input-value="row.status == 1" :label="row.status == 1 ? '已审核' : '未审核'" @change="setStatus(row)"></v-switch>
                      </template>
                    </el-table-column>
                    <el-table-column
                        fixed="right"
                        :label="$t('other.action')"
                        width="80">
                        <template slot-scope="{ $index }">
                          <v-btn small color="warning" outlined @click="handleRmoveTourfee($index)">{{ $t('actions.delete') }}</v-btn>
                        </template>
                      </el-table-column>
                  </el-table>
                </v-container>
              </v-expansion-panel>

              <v-expansion-panel readonly>
                <v-expansion-panel-header hide-actions>
                  <div class="d-flex align-center justify-space-between">
                    <span>导游预支</span>
                    <v-btn color="primary" rounded small>{{ $t('actions.add') }}</v-btn>
                  </div>
                </v-expansion-panel-header>
                <v-divider />
                <v-container class="pa-0">
                  <el-table
                    :data="tableData"
                    border>
                    <el-table-column
                      label="日期"
                      width="220">
                      <template slot="header">
                        <span class="mr-1">日期</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <date-picker type="date" small></date-picker>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="金额"
                      width="180">
                      <template slot="header">
                        <span class="mr-1">金额</span>
                        <small class="red--text">({{$t('other.required')}})</small>
                      </template>
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                          :rules="[rules.required]"
                          required
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="预支号"
                      width="180">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="凭证"
                      width="200">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="date"
                      label="备注"
                      min-width="140">
                      <template slot-scope="{ row }">
                        <v-text-field
                          v-model="row.name"
                          outlined
                          single-line
                          hide-details
                          dense
                        ></v-text-field>
                      </template>
                    </el-table-column>
                    <el-table-column
                      fixed="right"
                      prop="date"
                      label="审核"
                      width="140">
                      <template slot-scope="{ row }">
                        <v-switch class="mt-0" dense hide-details :input-value="row.status == 1" :label="row.status == 1 ? '已审核' : '未审核'" @change="setStatus(row)"></v-switch>
                      </template>
                    </el-table-column>
                    <el-table-column
                        fixed="right"
                        :label="$t('other.action')"
                        width="80">
                        <template slot-scope="{ $index }">
                          <v-btn small color="warning" outlined @click="handleRmoveTourfee($index)">{{ $t('actions.delete') }}</v-btn>
                        </template>
                      </el-table-column>
                  </el-table>
                </v-container>
              </v-expansion-panel>

              <v-expansion-panel readonly>
                <v-expansion-panel-header hide-actions>
                  <div class="d-flex align-center justify-space-between">
                    <span>合计</span>
                  </div>
                </v-expansion-panel-header>
                <v-divider />
                <v-container class="py-0">
                  <v-row>
                    <v-col cols="6" class="py-0 form-item-border">
                      <v-row align="center" style="height: 100%;">
                        <label class="text-right flex-shrink-0" style="width: 140px;">导游押金：</label>
                        <div class="pr-4 flex-grow-1">
                          <v-text-field></v-text-field>
                        </div>
                      </v-row>
                    </v-col>
                    <v-col cols="6" class="py-0 form-item-border">
                      <v-row align="center" style="height: 100%;">
                        <label class="text-right flex-shrink-0" style="width: 140px;">累计押金：</label>
                        <div class="pr-4 flex-grow-1">
                          <v-text-field
                            hide-details
                            single-line
                            solo
                            flat
                            readonly>
                          </v-text-field>
                        </div>
                      </v-row>
                    </v-col>
                  </v-row>
                </v-container>
              </v-expansion-panel>
            </v-expansion-panels>
          </v-card-text>
        </v-card>
      </v-col>
      <v-col cols="2">
        <v-banner sticky single-line>
          <v-row class="py-2">
            <v-col cols="5"><v-btn style="width: 80px;" @click="handleSave" color="primary">审核</v-btn></v-col>
            <!-- <v-col cols="5"><v-btn style="width: 80px;" @click="$router.back()">返回</v-btn></v-col> -->
          </v-row>
          <v-stepper class="elevation-0" non-linear vertical>
            <v-stepper-step editable step="1">
              导游信息
            </v-stepper-step>
            <v-stepper-content step="1">
              <v-card color="lighten-1"></v-card>
            </v-stepper-content>
            <v-stepper-step editable step="2">
              购物佣金
            </v-stepper-step>
            <v-stepper-content step="2">
              <v-card color="lighten-1"></v-card>
            </v-stepper-content>
            <v-stepper-step editable step="3">
              自费佣金
            </v-stepper-step>
            <v-stepper-content step="3">
              <v-card color="lighten-1"></v-card>
            </v-stepper-content>
            <v-stepper-step editable step="4">
              公司收导游
            </v-stepper-step>
            <v-stepper-content step="4">
              <v-card color="lighten-1"></v-card>
            </v-stepper-content>
            <v-stepper-step editable step="5">
              导游代收
            </v-stepper-step>
            <v-stepper-content step="5">
              <v-card color="lighten-1"></v-card>
            </v-stepper-content>
            <v-stepper-step editable step="6">
              公司付导游
            </v-stepper-step>
            <v-stepper-content step="6">
              <v-card color="lighten-1"></v-card>
            </v-stepper-content>
            <v-stepper-step editable step="7">
              导游代付
            </v-stepper-step>
            <v-stepper-content step="7">
              <v-card color="lighten-1"></v-card>
            </v-stepper-content>
            <v-stepper-step editable step="8">
              导游预支
            </v-stepper-step>
            <v-stepper-content step="8">
              <v-card color="lighten-1"></v-card>
            </v-stepper-content>
            <v-stepper-step editable step="9">
              合计
            </v-stepper-step>
          </v-stepper>
        </v-banner>
      </v-col>
    </v-row>
  </v-form>
</div>
</template>

<script>
export default {
  data() {
    return {
      panel: [0, 1, 2, 3, 4, 5, 6, 7],
      tableData: [{}],
      multipleSelection: [],
      rules: {
        required: value => !!value || 'required',
      }
    }
  },
  methods: {
    handleSelectionChange() {
      this.multipleSelection = val
    },
    handleSave() {

    }
  }
}
</script>

<style>

</style>